<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="../css/abc.css">

    <title>订单下达</title>

    <script src="../js/jquery-3.2.1.min.js"></script>
    <link rel="stylesheet" href="../layui/css/layui.css">
<style rel="stylesheet" type="text/css">
    .w3l-signup {
        position: relative;
        height: 100vh;
        background: url(../img/4k.jpg) no-repeat 0px 0px;

        background-size: cover;
    }
</style>

</head>
<body>
<section class="w3l-signup">
<!--导航栏-->
<div class="left">
    <ul class="layui-nav layui-nav-tree layui-nav-side daohanglan">

        <li class="layui-nav-item "><a href="/user/yonghu"><i class="layui-icon layui-icon-user"></i>   用户管理</a></li>
        <li class="layui-nav-item "><a href="/user/shangjia "><i class="layui-icon layui-icon-website"></i>   商家供货</a></li>
        <li class="layui-nav-item "><a href="/user/dingdan "><i class="layui-icon layui-icon-cart-simple"></i>   订单下达</a></li>
    </ul>
</div>

<!--右侧-->
<div class="right " id="tab">
    <div class="neirongqu">


        <table class="layui-table cssfd" id='tabletest'>
            <colgroup>
                <col width="150">
                <col width="200">
                <col>
            </colgroup>

            <thead>
            <tr>
                <th>配件</th>
                <th>数量</th>
                <th>删除</th>
            </tr>
            </thead>

            <tbody>

            </tbody>
        </table>


        <form class="layui-form" id="abc">

            <div class="layui-form-item">
                <label class="layui-form-label">配件</label>
                <div class="layui-input-inline">
                    <input type="text" name="dname" required lay-verify="required" placeholder="想买什么鸭？"
                           autocomplete="off" class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">数量</label>
                <div class="layui-input-inline">
                    <input type="text" name="shuliang" required lay-verify="required" placeholder="你要几个鸭？"
                           autocomplete="off" class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-submit lay-filter="formDemo">添加</button>
                    <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                </div>
            </div>
        </form>
        <script src="../layui/layui.js" type="text/javascript" charset="UTF-8"></script>
        <script>

            //Demo
            layui.use('form', function () {
                var form = layui.form;

                // //监听提交
                form.on('submit(formDemo)', function (data) {
                    // layer.msg(JSON.stringify(data.field));

                    $.ajax({
                        //几个参数需要注意一下
                        type: "POST",//方法类型
                        dataType: "json",//预期服务器返回的数据类型
                        url: "../dingdan/saveDingdan",//url
                        data: $('#abc').serialize(),
                        success: function (data) {
                            //  window.location.reload();
                        }

                    });
                });
            });
        </script>

    </div>
</div>

</section>
<script>

    $(function () {

        // alert("hello btn");
        // 发送ajax请求
        $.ajax({
            // 编写json格式，设置属性和值
            url: "../dingdan/findDingdan",
            dataType: "json",
            type: "post",
            success: function (data) {
                var str = "";//定义用于拼接的字符串
                for (var i = 0; i < data.length; i++) {
                    //拼接表格的行和列
                    str = " <tr> <td>" + data[i].dname + "</td> <td>" +
                        data[i].shuliang +
                        "</td><td><input type=\"button\" value=\"删除\" class=\"layui-btn  qwe\" onclick=\"del(this)\"></td> </tr>";
                    //追加到table中
                    $("#tabletest").append(str);
                }
            }
        });

    });

    function del(obj) {
        // alert($(this).html());
        var dcm = $(obj).parents("tr").children(":first");
        var tyr = dcm.text();
        $.ajax({
            //几个参数需要注意一下
            type: "post",//方法类型
            url: "../dingdan/deleteDingdan",//url
            data: {"dname": tyr},
            success: function (data) {
                alert("删除成功");
                window.location.reload();

            }, error: function () {
                alert("删除失败");
                window.location.reload();
            }

        });
    }


</script>
</body>
</html>
